<template>
  <div>
    <el-row class="main-form" :gutter="20">
      <el-col class="left-con" :span="12" :offset="0">
        <img class="shadow" :src="personInfo.avatar_url" alt="">
        <p>工号: {{personInfo.teacher_num}}</p>
        <p>地址: {{personInfo.address}}</p>
        <p>电话: {{personInfo.telephone}}</p>
      </el-col>
      <el-col :span="12" :offset="0">
        <p>姓名: {{personInfo.name}}</p>
        <p>性别: {{personInfo.sex}}</p>
        <p>民族: {{personInfo.nationality}}</p>
        <p>生日: {{personInfo.birthday}}</p>
        <p>身份证号: {{personInfo.id_num}}</p>
        <p>籍贯: {{personInfo.native_place}}</p>
        <p>政治面貌: {{personInfo.political_status}}</p>
        <p>学历: {{personInfo.educational_background}}</p>
        <p>邮箱: {{personInfo.email}}</p>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'InfoForm',
  props: {
    personInfo: {
      type: Object
    }
  }
}
</script>

<style lang="less" scoped>
.main-form {
  height: 300px;
  width: 400px;

  .left-con {

    img {
      height: 200px;
      display: block;
      border-radius: 4px;
    }
  }
}
</style>
